<html>

<head>
    <link rel="stylesheet" type="text/css" href="/css/smoothness/jquery-ui-1.12.1.custom.min.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="/lib/uniform/uniform.default.css" />
    <link rel="stylesheet" type="text/css" href="/css/opensans/opensans.css">
    <link rel="stylesheet" type="text/css" href="/css/font-awesome-4.6.3/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="/css/options_main_page.css" />
    <link rel="stylesheet" type="text/css" href="user_preferences.css" />

    <script src="/lib/jquery-3.3.1.min.js" type="text/javascript"></script>
    <script src="/lib/jquery-ui-1.12.1.custom.min.js" type="text/javascript"></script>
    <script src="/lib/uniform/jquery.uniform.js" type="text/javascript"></script>
    <script src="/lib/custom_i18n.js" type="text/javascript"></script>
    <script src="/lib/i18n_translator.js" type="text/javascript"></script>
    <script src="/lib/object-watch.js" type="text/javascript"></script>

    <script src="/js/cookie_helpers.js" type="text/javascript"></script>
    <script src="/js/utils.js" type="text/javascript"></script>
    <script src="/js/data.js" type="text/javascript"></script>

    <script src="options_page_chooser.js" type="text/javascript"></script>
    <script src="user_preferences.js" type="text/javascript"></script>

    <title i18n="Options"></title>
</head>

<body>
    <div id="navigation">
        <h1>EditThisCookie</h1>
        <ul>
            <li class="chooser" id="getting_started" i18n="getting_started"></li>
            <li class="chooser selected" id="user_preferences" i18n="Options"></li>
            <li class="chooser" id="block_rules" i18n="Blocked_Cookies"></li>
            <li class="chooser" id="readonly_rules" i18n="Protected_Cookies"></li>
        </ul>
    </div>

    <div id="options-box" class="box">
        <h1 i18n="Options"></h1>
        <hr>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="showAlerts" />
            <label for="showAlerts" class="formLabel" i18n="Show_Alerts"></label>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="showCommandsLabels" />
            <label for="showCommandsLabels" class="formLabel" i18n="ShowCommandsLabels"></label>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="refreshAfterSubmit" />
            <label for="refreshAfterSubmit" class="formLabel" i18n="reloadAfterChanges"></label>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="skipCacheRefresh" />
            <label for="skipCacheRefresh" id="skipCacheRefreshLabel" class="formLabel" i18n="skipCacheOnReload"></label>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="showChristmasIcon" />
            <label for="showChristmasIcon" class="formLabel" i18n="Show_Christmas_Icon"></label>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="showContextMenu" />
            <label for="showContextMenu" class="formLabel" i18n="Show_ContextMenu"></label>
            <a id="showContextMenuHelper" class="helper" i18n_title="Show_ContextMenu_helper">?</a>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="showDevToolsPanel" />
            <label for="showDevToolsPanel" class="formLabel" i18n="Show_DevTools_Panel"></label>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="showFlagAndDeleteAll" />
            <label for="showFlagAndDeleteAll" class="formLabel" i18n="Show_Flag_And_Delete_All"></label>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="showDomain" />
            <label for="showDomain" class="formLabel" i18n="Show_Domain"></label>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="showDomainBeforeName" />
            <label for="showDomainBeforeName" class="formLabel" id="showDomainBeforeNameLabel" i18n="Show_Domain_Before_Name"></label>
        </div>
        <div class="formLine">
            <span class="ui-icon ui-icon-minus" width="30px" style="float:left; margin-right:11.5px; margin-top: 2px;"></span>
            <label for="sortCookiesType" class="formLabel" i18n="Sort_Cookies"></label>
            <select type="select" id="sortCookiesType">
                <option value="domain_alpha" i18n="Sort_Cookies_Domain_Alpha"></option>
                <option value="alpha" i18n="Sort_Cookies_Alpha"></option>
            </select>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="useMaxDate">
            <label for="useMaxDate" class="formLabel" i18n="Max_Date_Option"></label>
        </div>
        <div class="formLine" id="maxDateContainer">
            <span class="ui-icon ui-icon-minus" width="30px" style="float:left; margin-right:11.5px; margin-top: 2px;"></span>
            <label for="maxDate" class="formLabel" i18n="Max_Date" id="maxDateLabel"></label>
            <input type="text" class="checkbox" id="maxDate" value="1" size="5">
            <div id="maxDateType">
                <input type="radio" id="radioHour" name="radioMaxDate" value="3600" />
                <label for="radioHour" i18n="hour"></label>
                <input type="radio" id="radioDay" name="radioMaxDate" value="8640" />
                <label for="radioDay" i18n="day"></label>
                <input type="radio" id="radioMonth" name="radioMaxDate" value="2592000" checked="checked" />
                <label for="radioMonth" i18n="month"></label>
                <input type="radio" id="radioYear" name="radioMaxDate" value="31104000" />
                <label for="radioYear" i18n="year"></label>
            </div>
            <div id="saveMaxDateButton" i18n="Save"></div>
            <div id="shortenProgress" style="display:none;">
                <i id="shortenSpinner" class="fa fa-refresh fa-spin"></i>
                <span>...</span>
            </div>
        </div>
        <div class="formLine">
            <input type="checkbox" class="checkbox" id="useCustomLocale">
            <label for="useCustomLocale" class="formLabel" i18n="Use_Custom_Locale"></label>:
            <select type="select" class="" id="customLocale">
            </select>
        </div>
        <div class="formLine">
            <span class="ui-icon ui-icon-minus"></span>
            <label for="copyCookiesType" class="formLabel" i18n="Copy_Cookies_Type"></label>
            <select type="select" id="copyCookiesType">
                <option value="json">JSON</option>
                <option value="netscape">Netscape HTTP Cookie File</option>
                <option value="semicolonPairs">Semicolon separated name=value pairs</option>
                <option value="lpw">Perl::LWP</option>
            </select>
        </div>
    </div>
</body>

</html>